<%--
  Created by IntelliJ IDEA.
  User: user
  Date: 2023/10/30
  Time: 14:23
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<html>
<head>
    <title>用户信息管理</title>
    <%--    引入bootstrap的css样式表--%>
    <link rel="stylesheet" href="css/bootstrap.min.css">
    <%--    引入bootstrap所需要的js文件，注意，在引入bootstrap.js前要先引入jquery--%>
    <script src="js/jquery.slim.min.js"></script>
    <script src="js/bootstrap.bundle.min.js"></script>
</head>
<body>
<div>
<%--    顶部条件搜索部分--%>
    <form class="form-inline" action="/getUserInfoes">
        <div class="form-group mx-sm-3 mb-2">
            <label for="inputPassword2" class="sr-only">Password</label>
            <input type="password" class="form-control" id="inputPassword2" placeholder="请输入用户名">
        </div>
        <button type="submit" class="btn btn-primary mb-2">查询</button>&nbsp; &nbsp;
        <button type="button" class="btn btn-success mb-2" data-toggle="modal" data-target="#exampleModal" data-whatever="@mdo">新增</button>&nbsp; &nbsp;
        <button type="button" class="btn btn-secondary mb-2">清空</button>
    </form>

<%--    用户列表信息显示--%>
    <table class="table table-hover">
        <thead>
        <tr>
            <th scope="col">#</th>
            <th scope="col">用户登录名</th>
            <th scope="col">用户真实姓名</th>
            <th scope="col">用户Email</th>
            <th scope="col">用户角色</th>
            <th scope="col">用户状态</th>
            <th scope="col">操作</th>
        </tr>
        </thead>
        <tbody>
        <c:forEach var="userinfo" items="${sessionScope.userinfoes}" varStatus="vst">
            <tr>
                <th scope="row">${vst.index+1}</th>
                <td>${userinfo.USER_LOGNAME}</td>
                <td>${userinfo.USER_REALNAME}</td>
                <td>${userinfo.USER_EMAIL}</td>
                <td>
                    <c:if test="${userinfo.USER_ROLE==1}">用户</c:if>
                    <c:if test="${userinfo.USER_ROLE==2}">企业管理员</c:if>
                    <c:if test="${userinfo.USER_ROLE==3}">管理员</c:if>
                </td>
                <td>
                    <c:if test="${userinfo.USER_STATE==1}">正常</c:if>
                    <c:if test="${userinfo.USER_STATE==0}">禁用</c:if>
                </td>
                <td>
                    <a class="btn btn-warning" href="/getUserByID?userid=${userinfo.USER_ID}">编辑</a>
                    <a class="btn btn-danger">删除</a>
                </td>
            </tr>
        </c:forEach>


        </tbody>
    </table>

<%--    新增功能的模态框--%>
    <div class="modal fade" id="exampleModal" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title" id="exampleModalLabel">用户信息新增</h5>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div>
                <div class="modal-body">
                    <form action="/updateUserInfo" id="userInfoForm">

                        <div class="form-group">
                            <label for="userlogname" class="col-form-label">用户登录名:</label>
                            <input type="text" class="form-control" id="userlogname" name="userlogname">
                        </div>
                        <div class="form-group">
                            <label for="userrelname" class="col-form-label">用户真实姓名:</label>
                            <input type="text" class="form-control" id="userrelname" name="userrelname">
                        </div>
                        <div class="form-group">
                            <label for="userpwd" class="col-form-label">密码:</label>
                            <input type="password" class="form-control" id="userpwd" name="userpwd">
                        </div>
                        <div class="form-group">
                            <label for="useremail" class="col-form-label">用户Email:</label>
                            <input type="email" class="form-control" id="useremail" name="useremail">
                        </div>
                        <div class="form-group">
                            用户角色：
                            <input type="radio" name="userrole" value="1">普通用户&nbsp;
                            <input type="radio" name="userrole" value="2">企业管理员&nbsp;
                            <input type="radio" name="userrole" value="3">系统管理员
                        </div>
                        <div class="form-group">
                            账号状态：
                            <input type="radio" name="userstatus" value="1">正常&nbsp;
                            <input type="radio" name="userstatus" value="2">禁用
                        </div>
                    </form>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-secondary" data-dismiss="modal">关闭</button>
                    <button type="button" class="btn btn-primary" onclick="updateUserInfo()">用户新增</button>
                </div>
            </div>
        </div>
    </div>

</div>

</body>
<script>
    $('#exampleModal').on('show.bs.modal', function (event) {

    })

    function updateUserInfo(){
        document.getElementById("userInfoForm").submit();
    }
</script>
</html>
